@extends('layout.page')
@section('title','活动 - 详情')

@section('stylesheet')
    <link href="/css/custom.css" rel="stylesheet">
    <style>
        .short {
            display: inline-block;
            text-align: center;
            padding: 5px 25px 5px 5px;
            margin: 5px;
            border-radius: 20%;
        }
    </style>
@endsection


@section('static-page')
    <div class="col-sm-12">
        <div class="ibox">
            <div class="ibox-content">
                <div id="activity-form" method="POST" action="/ceb/activities/check?id={{$activity->id}}"
                     class="wizard-big form-horizontal">
                    <div class="tabs-container">
                        <ul class="nav nav-tabs">
                            <li class="active">
                                <a data-toggle="tab" href="#basic" aria-expanded="true"> 基本信息</a>
                            </li>
                            <li class="">
                                <a data-toggle="tab" href="#targets" aria-expanded="false">活动对象</a>
                            </li>
                            <li class="">
                                <a data-toggle="tab" href="#rewards" aria-expanded="false">活动奖励</a>
                            </li>
                            <li class="">
                                <a data-toggle="tab" href="#reports" aria-expanded="false">活动报告</a>
                            </li>
                        </ul>
                        {{csrf_field()}}
                        <div class="tab-content">
                            <div id="basic" class="tab-pane active pt-10">
                                <div class="form-group">
                                    <label class="control-label col-sm-2">活动名称</label>

                                    <div class="col-sm-10">
                                        <input disabled class="form-control required" id="activity-name" name="name"
                                               type="text" value="{{$activity->name}}">
                                    </div>
                                </div>
                                <div class="hr-line-dashed"></div>
                                <div class="form-group">
                                    <label class="control-label col-sm-2">活动时间</label>

                                    <div class=" col-sm-10">
                                        <div class="input-daterange input-group" id="datepicker">
                                            <input disabled type="text" class="input-sm form-control _date"
                                                   name="start_date"
                                                   value="{{ date('Y-m-d',$activity->start_time) }}"/>
                                            <span class="input-group-addon"> —— </span>
                                            <input disabled type="text" class="input-sm form-control _date"
                                                   name="end_date"
                                                   value="{{ date('Y-m-d',$activity->end_time) }}"/>
                                        </div>
                                    </div>
                                </div>
                                <div class="hr-line-dashed"></div>
                                <div class="form-group">
                                    <label class="control-label col-sm-2">banner图</label>

                                    <div class="col-sm-10">
                                        <img src="{{csrc($activity->banner)}}" width="100%">
                                    </div>
                                </div>
                                <div class="hr-line-dashed"></div>
                                <div class="form-group">
                                    <label class="control-label col-sm-2">活动规则</label>

                                    <div class="col-sm-10">
                                            <textarea disabled name="rules" class="form-control"
                                                      rows="5">{{$activity->rules}}</textarea>
                                    </div>
                                </div>
                                <div class="hr-line-dashed"></div>
                                <div class="form-group">
                                    <label class="control-label col-sm-2">预期目标</label>

                                    <div class="col-sm-10">
                                            <textarea disabled name="purpose" class="form-control"
                                                      rows="5">{{$activity->purpose}}</textarea>
                                    </div>
                                </div>

                            </div>
                            <div id="targets" class="tab-pane pt-10">
                                <div class="col-sm-12">
                                    <div class="form-group">
                                        <div class="radio">
                                            <label><input disabled type="radio"
                                                          @if($activity->filter_type == \App\Constants\UserFilterType::CHANNEL) checked=""
                                                          @endif value="1" id="target1"
                                                          name="filter_type">渠道</label>
                                            &nbsp;&nbsp;&nbsp;&nbsp;
                                            <label><input disabled type="radio"
                                                          @if($activity->filter_type == \App\Constants\UserFilterType::USER_GROUP) checked=""
                                                          @endif value="2" id="target2"
                                                          name="filter_type">群体</label>
                                        </div>
                                    </div>
                                </div>
                                <div class="form-group">
                                    <label class="control-label col-sm-2">
                                        @if($activity->filter_type == \App\Constants\UserFilterType::CHANNEL)
                                            已选渠道:
                                        @elseif($activity->filter_type == \App\Constants\UserFilterType::USER_GROUP)
                                            已选群体:
                                        @endif
                                    </label>

                                    <div class="col-sm-10" id="selected-filter"></div>
                                </div>
                                <div class="form-group">
                                    <label class="control-label col-sm-2">
                                        已排除用户:
                                    </label>

                                    <div class="col-sm-10" id="selected-user-list"></div>
                                </div>
                            </div>

                            <div id="rewards" class="tab-pane pt-10">
                                <div id="selected-reward"></div>
                            </div>
                            <div id="reports" class="tab-pane pt-10">
                                @if($report)
                                    <div class="col-sm-12">活动时间：{{date('Y年M月d日',$activity->start_time)}}-{{date('Y年M月d日',$activity->end_time)}}</div>
                                    <div class="col-sm-6">参与活动人数：{{$report['members']}}人</div>
                                    <div class="col-sm-6">男女比例：{{ratio($report['male'],$report['female'])}}</div>
                                    <div class="col-sm-6">总成交额：{{$report['total_amount']}}元</div>
                                    <div class="col-sm-6">年化总成交额：{{$report['annual_amount']}}元</div>
                                    <div class="col-sm-6">使用券总额：{{$report['voucher_used_amount']}}元({{$report['voucher_used_count']}}张)</div>
                                    <div class="col-sm-6">发放券总额：{{$report['voucher_total_amount']}}元({{$report['voucher_total_count']}}张)</div>
                                    <div class="col-sm-6">发布标的：{{$report['subject_count']}}元</div>
                                @else
                                    <div class="alert alert-danger">获取报告失败!</div>
                                @endif
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
@endsection

@section('javascript')
    <script>
        var activity = {!! $activity->toJson() !!};
        var ignore_user_list = {!! json_encode($ignore_user_list) !!};
        var behavior_list = {!! json_encode($behavior_list) !!};

        function setTags(container, list, postName) {
            console.log(list);
            container = $(container).empty();
            $.each(list, function (k, v) {
                var s = '<div class="alert alert-success alert-dismissable short" title="' + (v.title ? v.title : v.name) + '">' + v.name;
                if (postName) {
                    s += '<input type="text" name="' + postName + '[]" value="' + v.value + '" class="hidden">';
                }
                s += '</div>'
                container.append(s);
            });
        }
        $(document).ready(function () {
            var list = [];
            $.each(activity.user_filter.split(','), function (i, n) {
                list.push({
                    value: 0,
                    name: n
                });
            });
            setTags('#selected-filter', list);

            var list = [];
            $.each(ignore_user_list, function (i, v) {
                list.push({
                    value: v.id,
                    name: v.name
                });
            });
            setTags('#selected-user-list', ignore_user_list);

            var behavior_map = mkmap(behavior_list, 'id');

            var list = [];
            $.each(activity.packages, function (k, v) {
                list.push({
                    value: 0,
                    name: v.name,
                    title: '触发方式:' + behavior_map[v.pivot.behavior].name
                });
            });
            setTags('#selected-reward', list);
        });

    </script>
@endsection
